<template>
    <fieldset>
        <legend>详情页</legend>
        <img :src="imgsrc" alt="">
        <h1>{{result.productInfo || result.productInfo2}}</h1>
    </fieldset>
</template>

<script>
    export default {
        // props:['productid'],
        data(){
            return {
                result:{},
                imgsrc:''
            }
        },
        mounted(){
            // 两个路由对象
            // $router是路由配置中最大的对象，而$route是当前进入的路由对象，$router包含了$route
            // console.log(this.$route);
            // console.log(this.$router);
            
            // 获取动态路由参数, :xxx 这种配置的路由都称为 动态路由
            // console.log(this.$route.params);

            let {productid} = this.$route.params
            fetch(`http://chst.vip:1234/api/getmoneyctrlproduct?productid=${productid}`)
            .then(body=>body.json())
            .then(res=>{
                console.log(res);
                this.result = res.result[0]
                let regExp = /(?<=imgurl=)[^'"]*/;
                this.imgsrc = regExp.exec(this.result.productImg2)[0]
            })
        }
    }

</script>